<template>
  <!-- 这个写组件的结构
  要求: template中写的组件结构必须被一个父元素包裹
   -->
  <div>
    <h1 class="box">{{ msg }}</h1>
    <Test />
    <p>嘻嘻嘻嘻嘻嘻嘻嘻</p>
  </div>
</template>

<script>
import Test from './components/Test.vue'
// 这个组件的结构
export default {
  components: {
    Test,
  },
  data() {
    return {
      msg: 'app组件',
    }
  },
}
</script>

<style>
/* 注意: app组件的style一般不写scoped.因为app中的样式一般都是全局样式或公共样式 */
/* 这里是组件的样式 */
.box {
  color: red;
}
</style>
